---
title: Jimp
description: JavaScript Image Manipulation Program
template: splash
hero:
  tagline: The JavaScript Image Manipulation Program
  image:
    file: ../../assets/image.png
  actions:
    - text: Read the docs
      link: /jimp/guides/getting-started/
      icon: right-arrow
      variant: primary
    - text: GitHub
      link: https://github.com/jimp-dev/jimp
      icon: external
---

import { Steps, Card, CardGrid, LinkCard } from "@astrojs/starlight/components";

<CardGrid>
  <Card title="Image Formats" icon="pencil">
    Supported image formats include PNG, JPEG, BMP, GIF, and TIFF.
  </Card>
  <Card title="Image Manipulation" icon="add-document">
    You can resize, crop, apply filters and more.
  </Card>
  <Card title="Pluggable" icon="setting">
    Create your own plugins to add new image manipulation methods or formats.
  </Card>
  <Card title="Just JavaScript" icon="open-book">
    Jimp is just JavaScript, so you can use it in anywhere that JavaScript can
    be used.
  </Card>
</CardGrid>

## Usage

Using Jimp is simple.
Load an image, manipulate it, and save it.

<Steps>

1. Load an image.

   ```ts
   import { Jimp } from "jimp";

   const image = await Jimp.read("test/image.png");
   ```

2. Manipulate the image.

   ```ts
   image.resize({ width: 100 });
   ```

3. Save the image.

   ```ts
   await image.write("test/output.png");
   ```

</Steps>

<CardGrid>
  <LinkCard title="Getting Started" href="/jimp/guides/getting-started/" />
  <LinkCard title="API Reference" href="/jimp/api/jimp/classes/jimp/" />
</CardGrid>
